<template>
  <ion-page>
    <ion-tabs>
      <ion-router-outlet></ion-router-outlet>
      <ion-tab-bar slot="bottom">
        <ion-tab-button tab="eventlist" href="/tabs/eventlist">
          <ion-icon aria-hidden="true" :icon="reader" />
          <ion-label>Event</ion-label>
        </ion-tab-button>

        <ion-tab-button tab="dutypage" href="/tabs/dutypage">
          <ion-icon aria-hidden="true" :icon="clipboard" />
          <ion-label>Duty</ion-label>
        </ion-tab-button>
       
        <ion-tab-button tab="minepage" href="/tabs/minepage">
          <ion-icon aria-hidden="true" :icon="person" />
          <ion-label>Mine</ion-label>
        </ion-tab-button> 
      </ion-tab-bar>
    </ion-tabs>
  </ion-page>
</template>

<script setup lang="ts">
import { IonTabBar, IonTabButton, IonTabs, IonLabel, IonIcon, IonPage, IonRouterOutlet } from '@ionic/vue';
import {  reader,clipboard,person} from 'ionicons/icons';
</script>
